<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title> <style> li{
    background-color: aqua;
    width: 100px;
    height: 20px;
    float: left;
}
    .wall{ clear: both ;
    height:16px}
    *{
        margin: 0;
        padding: 0;
    }

</style>
</head>
<body>
<div>

    <ul>
        <li>a</li>
        <li>b</li>
        <li>c</li>
    </ul>
</div>
<!--隔墙法是为了在浮动元素之间 添加一堵墙
 目的是换行,清楚浮动,并设置元素之间的距离-->
<div class="wall"></div>
<div>
    <ul>
        <li class="box2">1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</div>

</body>
</html>